﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<CognisessDA.User>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <form id="CognisessExperienceForm" action="/Account/CognisessExperience" method="post"
    name="form1">
    <div class="why">
        <div class="review_l">
            <div class="personalise">
                <h1>
                    Personalise your Cognisess training</h1>
                <p>
                    We will use this information to create and suggest personalised training recommendations
                    for you so that you can get the most out of your training.</p>
            </div>
            <div class="review_lf">
                <b class="review_lf_t"><b class="review_lf_tl"></b><b class="review_lf_tr"></b></b>
                <b class="review_lf_c">
                    <div class="personalise_a">
                        <ul>
                            <li class="personalise_a1">
                                <label>
                                    First Name:</label><span><%= Html.TextBoxFor(model => model.Firstname) %></span></li>
                            <li class="personalise_a1">
                                <label>
                                    Date of Birth:</label>
                                <span>
                                    <select id="sltDay" name="sltDay">
                                        <option selected="selected">Day</option>
                                    </select>
                                    <select id="sltMonth" name="sltMonth" onchange="CheckMonth(this.value)">
                                        <option selected="selected">Moths</option>
                                    </select>
                                    <select id="sltYear" name="sltYear" onchange="CheckYear(this.value)">
                                        <option selected="selected">Year</option>
                                    </select>
                                </span></li>
                            <li class="personalise_a3">
                                <label>
                                    Education Level:</label>
                                <span>
                                    <%= Html.DropDownListFor(model => model.EducationLevel, (IEnumerable<SelectListItem>)ViewData["Education"])%>
                                </span></li>
                            <li class="personalise_a2">
                                <label>
                                    Gender:</label><%=Html.RadioButtonFor(m => m.Gender,(int)CognisessCommLib.EnumGender.Male )%>Male
            <%=Html.RadioButtonFor(m => m.Gender, (int)CognisessCommLib.EnumGender.Female)%>Female</li>
                            <li class="personalise_a3">
                                <label>
                                    Timezone:
                                </label>
                                <span>
                                    <%= Html.DropDownListFor(model => model.TimeZone, (IEnumerable<SelectListItem>)ViewData["TimeZoneT"])%></span></li>
                            <li class="personalise_a3">
                                <label>
                                    How did you hear about us?
                                </label>
                                <span>
                                    <%= Html.DropDownListFor(model => model.HowToKnowUs, (IEnumerable<SelectListItem>)ViewData["About"])%></span></li>
                        </ul>
                    </div>
                    <div class="sign_up_fb">
                        <label class="personalise_button1">
                            <input type="button" name="btnH" id="btnH" value="" onclick="checkShow()" /></label>
                        <em class="personalise_button2">
                            <input type="submit" name="button" id="button" value="" /></em>
                    </div>
                </b><b class="review_lf_d"><b class="review_lf_dl"></b><b class="review_lf_dr"></b>
                </b>
            </div>
        </div>
        <span class="review_r"><b class="review_lf_t"><b class="review_lf_tl"></b><b class="review_lf_tr">
        </b></b><b class="review_r_c">&nbsp;</b> <b class="review_lf_d"><b class="review_lf_dl">
        </b><b class="review_lf_dr"></b></b></span>
    </div>
    </form>
    <style type="text/css">
        .error
        {
            text-align: left;
            color: Red;
        }
    </style>

    <script type="text/javascript" language="javascript">

        window.onload = function() {
            var aa = document.getElementById("sltYear");
            BindYear(aa.options[0].value);
            CheckYear(aa);
            //var objMonth = document.getElementById("sltMonth");
            // CheckMonth(objMonth);

        }
        function BindYear(aa) {
            var iYear = new Date().getFullYear();
            for (var i = iYear - 1; i > 1900; i--) {
                var mYear = document.getElementById("sltYear").value;
                if (i != aa) {
                    document.getElementById("sltYear").options.add(new Option("" + i + "", i));
                }
            }
        }
        //创建option元素，并追加到指定select元素  
        function append(o, v) {
            // var option=document.createElement("option");  
            //option.value=v;  
            // option.innerText=v;  
            // o.appendChild(option);  
            var option = new Option(v, v);
            o.options.add(option);
        }

        function CheckYear(obj) {
            var iYear = new Date().getFullYear();
            var iMonth = new Date().getMonth();
            var objMonth = document.getElementById("sltMonth");
            var objDay = document.getElementById("sltDay");
            var option_M = objMonth.options[0];
            objMonth.options.length = 0;
            objMonth.options.add(option_M);
            var option_D = objDay.options[0];
            objDay.options.length = 0;
            objDay.options.add(option_D);
            var mm = document.getElementById("sltMonth");
            if (obj != -1) {
                if (obj != iYear) {
                    for (var i = 1; i <= 12; i++) {
                        if (i != mm.options[0].value) {
                            if (i == 1)
                                document.getElementById("sltMonth").options.add(new Option("January", i));
                            if (i == 2)
                                document.getElementById("sltMonth").options.add(new Option("February", i));
                            if (i == 3)
                                document.getElementById("sltMonth").options.add(new Option("March", i));
                            if (i == 4)
                                document.getElementById("sltMonth").options.add(new Option("April", i));
                            if (i == 5)
                                document.getElementById("sltMonth").options.add(new Option("May", i));
                            if (i == 6)
                                document.getElementById("sltMonth").options.add(new Option("June", i));
                            if (i == 7)
                                document.getElementById("sltMonth").options.add(new Option("July", i));
                            if (i == 8)
                                document.getElementById("sltMonth").options.add(new Option("August", i));
                            if (i == 9)
                                document.getElementById("sltMonth").options.add(new Option("September", i));
                            if (i == 10)
                                document.getElementById("sltMonth").options.add(new Option("October", i));
                            if (i == 11)
                                document.getElementById("sltMonth").options.add(new Option("November", i));
                            if (i == 12)
                                document.getElementById("sltMonth").options.add(new Option("December", i));
                        }
                    }
                }
            }
        }

        function CheckMonth(obj) {
            var iYear = document.getElementById("sltYear").value;
            var iMonth = document.getElementById("sltMonth").value;
            var objDay = document.getElementById("sltDay");
            var option_f = objDay.options[0];
            objDay.options.length = 0;
            objDay.options.add(option_f);
            if (iMonth == 1 || iMonth == 3 || iMonth == 5 || iMonth == 7 || iMonth == 8 || iMonth == 10 || iMonth == 12) {
                for (var j = 1; j <= 31; j++) {
                    if (j != option_f.value) {
                        append(objDay, j);
                    }
                }
            }
            if (iMonth == 4 || iMonth == 6 || iMonth == 9 || iMonth == 11) {
                for (var j = 1; j <= 30; j++) {
                    if (j != option_f.value) {
                        append(objDay, j);
                    }
                }
            }
            if (iMonth == 2) {
                if (iYear % 4 == 0 && (iYear % 100 != 0 || iYear % 400 == 0)) {
                    for (var j = 1; j <= 29; j++) {
                        if (j != option_f.value) {
                            append(objDay, j);
                        }
                    }
                }
                else {
                    for (var j = 1; j <= 28; j++) {
                        if (j != option_f.value) {
                            append(objDay, j);
                        }
                    }
                }
            }
        }
        function CheckDay(obj) {
        }
        $().ready(function() {
            $("#CognisessExperienceForm").validate({
                rules: {
                    firstName: { required: true, rangelength: [1, 20] },
                    sltYear: { digits: true },
                    sltMonth: { digits: true },
                    sltDay: { digits: true },
                    Education: { required: true },
                    Timezone: { required: true },
                    About: { required: true }
                },
                messages: {
                firstName: { required: "Please select your FirstName.", rangelength: "firstName cannot exceed 20 characters." },
                    sltYear: { digits: "Please select your Year." },
                    sltMonth: { digits: "Please select your Month." },
                    sltDay: { digits: "Please select your Day." },
                    Education: { required: "Please select your Education." },
                    Timezone: { required: "Please select  your Time Zone." },
                    About: { required: "Please select  How did you hear about us?" }
                },
                remote: {
                    url: "Account/CognisessExperience",
                    type: "post",
                    dataType: "json",
                    data: {
                    username: function() {
                            return $("#firstName").val();
                            return $("#Education").val();
                            return $("#Timezone").val();
                            return $("#sltYear").val();
                            return $("#sltMonth").val();
                            return $("#sltDay").val();
                            return $("#BirthDate").val();
                            return $("#About").val();
                        }
                    }
                }
            });
        });
        $.validator.setDefaults({
            submitHandler: function(form) { form.submit(); }
        });

        function checkShow() {
            location.href = "/Home";
        }
    </script>

</asp:Content>
